<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>详情页面</title>
    <link href="/pharmacy/css/shopdetail.css" rel="stylesheet" type="text/css">
    <script src="/pharmacy/plugins/jquery/jquery-3.4.1.js"></script>
    <script>
        var seconds = ${countdown}
            console.log(seconds)
        var interval = setInterval(function () {
            seconds--
            var html = toDays2(seconds)
            if(seconds > 0){
                $('#countdown').text(html)
            } else {
                $('#countdown').text('已过期')
                clearInterval(interval)
            }
        },1000)

        function toDays2(seconds) {
            var s = seconds % 60; // 秒
            var mi = (seconds - s) / 60 % 60; // 分钟
            var h =  ((seconds - s) / 60 - mi ) / 60 % 24; // 小时
            var d =  (((seconds- s) / 60 - mi ) / 60 - h ) / 24; // 天
            return d + "天" + h + "时" + mi + "分" + s + "秒";
        }

    </script>
</head>
<body>
导航栏
<!-----商品详情部分------->
<div class="shopdetails">
    <div id="leftbox">
        <div id="showbox">
            <img src="/pharmacy/${seckillGoodsVO.goodImages}" width="400" height="400" />
        </div>
    </div>
    <!----中间----->
    <div class="centerbox">
        <p id="goodId" style="display: none">${seckillGoodsVO.goodId}</p>
        <p class="imgname" style="margin-left: 10px;margin-top: 30px;" id="goodName">${seckillGoodsVO.goodName}</p>
        <p style="margin-left: 10px;width: 90%;font-size: larger;color: red;padding-bottom: 10px;"><span >剩余时间：</span><span id="countdown"></span></p>
        <p class="price" style="margin-left: 10px;width: 90%;">秒杀价：
            <span style="font-size:30px;margin-left: 10px;color:red;">￥${seckillGoodsVO.seckillPrice}</span>
            <span style="font-size: 14px;text-decoration: line-through;margin-left: 24px;margin-top: 15px;">￥<span>${seckillGoodsVO.goodPrice}</span></span>
            <span class="nophone-rspan5" style="font-size: 14px;border: 1px solid #fc3535;background-color: white;color: #fc3535;height: 20px;line-height: 20px;text-align: center;margin-top: 10px;margin-left: 10px;padding-left: 5px;padding-right: 5px;">立省￥<font id="henan_price">${seckillGoodsVO.goodPrice-seckillGoodsVO.seckillPrice}</font></span>
        </p>
        <div class="clear"></div>
        <div style="margin-top: 50px;margin-top: 25px;margin-left: 10px;padding-left: 10px;font-size: 15px">
            <span>已售:${seckillGoodsVO.seckillNum}件</span>
            <span style="margin-left: 20px;">剩余:${seckillGoodsVO.seckillStock}件</span>
        </div>
        <p class="buy" style="margin-bottom: 10px;margin-top: 10px;"><a href="javascript:;" onclick="buy()" style="margin-left: 300px;background-color: red;color: white">立即抢购</a></p>
        <div class="clear"></div>
        <p class="fuwu" style="margin-top: 25px;">服务承诺：</p>
        <p class="pay" style="margin-top: 25px;">支付方式：</p>
        <p class="kefu">客服：</p>
    </div>
</div>
顶部导航栏


<script type="text/javascript">

    function buy(){
        var goodId = ${seckillGoodsVO.goodId}
        console.log(goodId)
        $.ajax({
            url:"http://localhost:8888/pharmacy/seckillGoods?goodId="+goodId,
            type:"GET",
            dataType:"json",
            //data->解析之后的json数据
            success:function (data) {
                console.log(1)
                console.log(data)
                if(data.code==0){
                    alert("请先登录")
                    location.href="/pharmacy/index/login";
                }
                else if(data.message=="fail"){
                    alert("已抢购完，欢迎下次参加活动")
                }else{
                    window.location.href="/pharmacy/seckillOrder?orderId="+ data.orderId +"&goodId="+goodId
                }
            },
        })
    }

</script>
</body>
</html>
